define(['pAjax','jquery'], () => {
    function indexLoad() {
        
       let  ul = document.querySelector('.xr>ul')
        let li=document.querySelectorAll('.nav_nav>ul>li>ul')
        console.log(li)
        pAjax({ url: '../libs/goodsList.json' })
            .then(res => {
                let data = JSON.parse(res)
                data = data.slice(0, 8)
                console.log(data)
                render(data)
                ren(data)
            })
            function ren(data) {
                data.forEach(item => {
                    li[0].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[1].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[2].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[3].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[4].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[5].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                    li[6].innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                        <img src="${item.images[0]}">
                        <br>
                        <span class="hide">${item.name}</span>
                        <br>
                        <span class="price_min">${item.price_min + '元'}</span>
                        <br>
                    </a>
                    </li>
                    `
                })
            }
        function render(data) {
            data.forEach(item => {
                ul.innerHTML += `
                    <li>
                    <a href="html/details.html?id=${item.product_id}" style="text-decoration:none; color:black;">
                    <img src="${item.images[0]}">
                    <p class="title hide">${item.name}</p>
                    <p class="price">${item.price_min + '元'}</p>
                    <br>
                </a>
                </li>
                `
            })
        }
    }
    return {
        indexLoad: indexLoad
    }
})
